<template>
  <div>
    <a-modal
      ref="modal"
      :width="500"
      :visible="visible"
      style="text-align:center"
      @ok="() => { $emit('ok') }"
      @cancel="() => { $emit('cancel',waring) }"
    >
      <template slot="footer" >
        <a-row type="flex" justify="center">
          <a-col :span="12">
            <div align="center">
              <a-button :loading="loading" type="danger" @click="getWaring">停用</a-button>
              <a-button type="primary" @click="Cancels">取消</a-button>
            </div>
          </a-col>
        </a-row>
      </template>
      <a-spin :spinning="loading">
        <a-icon type="warning" class="jgicon"	/>
        <h2>警告提示</h2>
        <span>是否停用当前所选数据</span>
      </a-spin>
    </a-modal>
  </div>
</template>

<script>
  export default {
    name:'a'+ Date.now(),
  props: {
    visible: {
      type: Boolean,
      required: true
    },
    loading: {
      type: Boolean,
      default: () => false
    }
  },
  data() {
    return {
      waring:true
    }
  },

  methods: {
    getWaring(){
      this.$emit('ok')
    },
    Cancels(){
      this.$emit('cancel',this.waring)
    }
  }
}
</script>

<style lang='less'  scoped>
.jgicon{
  font-size: 100px;
  color: red;
}
</style>
